﻿<%@ Page Language="C#" MasterPageFile="~/Demo.master" Inherits="DemoPage" Title="Effects of Dialog" %>

<%@ Register Src="~/CodeFormatter.ascx" TagName="Code" TagPrefix="demo" %>

<script runat="server">
    protected void ShowEffectChanged(object sender, EventArgs e)
    {
        DemoDialog.ShowEffect = (JQueryEffects)Enum.Parse(typeof(JQueryEffects), ShowEffectDropDown.SelectedValue);
    }

    protected void HideEffectChanged(object sender, EventArgs e)
    {
        DemoDialog.HideEffect = (JQueryEffects)Enum.Parse(typeof(JQueryEffects), HideEffectDropDown.SelectedValue);
    }
    
</script>

<asp:Content ID="Content1" ContentPlaceHolderID="DemoHolder" runat="Server">
    <div class="dna-state-help ui-corner-all">
        Using <b>ShowEffect</b>,<b>HideEffect</b> to control Dialog show/hide.
    </div>
    <style type="text/css">
        .collapsepanel { float: left; margin: 5px; width: 200px; }
    </style>
    <br />
    <br />
    <br />
    <DotNetAge:SimpleButton ID="SimpleButton1" runat="server" Text="Open Dialog" />
    <br />
    <DotNetAge:Dialog ID="DemoDialog" runat="server" Draggable="true" Resizable="false"
        Title="Server Dialog">
        <Trigger TargetID="SimpleButton1" />
        <Buttons>
            <DotNetAge:DialogButton Text="OK" OnClientClick="$(this).dialog('close')" />
        </Buttons>
        <BodyTemplate>
            <div style="padding: 30px;">
                This is a Dialog shows via Server.
            </div>
        </BodyTemplate>
    </DotNetAge:Dialog>
    <br />
    <DotNetAge:CollapsablePanel ID="CollapsablePanel1" runat="server" Title="Effect Properties"
        CssClass="collapsepanel">
        <ContentTempalte>
            <div class="dna-demo-fields">
                <ul>
                    <li><span>ShowEffects:</span><asp:DropDownList ID="ShowEffectDropDown" runat="server"
                        AutoPostBack="true" Width="100" OnSelectedIndexChanged="ShowEffectChanged">
                        <asp:ListItem Text="None" Value="None" Selected="True"></asp:ListItem>
                        <asp:ListItem Text="Blind" Value="Blind"></asp:ListItem>
                        <asp:ListItem Text="Bounce" Value="Bounce"></asp:ListItem>
                        <asp:ListItem Text="Clip" Value="Clip"></asp:ListItem>
                        <asp:ListItem Text="Drop" Value="Drop"></asp:ListItem>
                        <asp:ListItem Text="Explode" Value="Explode"></asp:ListItem>
                        <asp:ListItem Text="Fold" Value="Fold"></asp:ListItem>
                        <asp:ListItem Text="Highlight" Value="Highlight"></asp:ListItem>
                        <asp:ListItem Text="Pulsate" Value="Pulsate"></asp:ListItem>
                        <asp:ListItem Text="Scale" Value="Scale"></asp:ListItem>
                        <asp:ListItem Text="Shake" Value="Shake"></asp:ListItem>
                        <asp:ListItem Text="Slide" Value="Slide"></asp:ListItem>
                        <asp:ListItem Text="Transfer" Value="Transfer"></asp:ListItem>
                    </asp:DropDownList>
                    </li>
                    <li><span>HideEffects:</span><asp:DropDownList ID="HideEffectDropDown" runat="server"
                        AutoPostBack="true" Width="100" OnSelectedIndexChanged="HideEffectChanged">
                        <asp:ListItem Text="None" Value="None" Selected="True"></asp:ListItem>
                        <asp:ListItem Text="Blind" Value="Blind"></asp:ListItem>
                        <asp:ListItem Text="Bounce" Value="Bounce"></asp:ListItem>
                        <asp:ListItem Text="Clip" Value="Clip"></asp:ListItem>
                        <asp:ListItem Text="Drop" Value="Drop"></asp:ListItem>
                        <asp:ListItem Text="Explode" Value="Explode"></asp:ListItem>
                        <asp:ListItem Text="Fold" Value="Fold"></asp:ListItem>
                        <asp:ListItem Text="Highlight" Value="Highlight"></asp:ListItem>
                        <asp:ListItem Text="Pulsate" Value="Pulsate"></asp:ListItem>
                        <asp:ListItem Text="Scale" Value="Scale"></asp:ListItem>
                        <asp:ListItem Text="Shake" Value="Shake"></asp:ListItem>
                        <asp:ListItem Text="Slide" Value="Slide"></asp:ListItem>
                        <asp:ListItem Text="Transfer" Value="Transfer"></asp:ListItem>
                    </asp:DropDownList>
                    </li>
                    </li>
                </ul>
            </div>
        </ContentTempalte>
    </DotNetAge:CollapsablePanel>
    <div style="clear: left;">
        <br />
        <br />
        <demo:Code runat="server" ID="codeView" SourceFile="~/Dialog/Codes/UpdatePanelServerDialog.aspx" />
</asp:Content>
